<template>
  <div class="role">
    <LQuery :queryModule="queryModule">
      <template #event>
        <el-button type="primary" @click="roleAdd">新增</el-button>
        <el-button type="danger" @click="roleDel">删除</el-button>
      </template>
    </LQuery>
  </div>
</template>

<script setup lang="ts">
  import { reactive } from "vue";
  import type { FormInstance } from "element-plus";
  import LQuery from "./components/tableModule.vue";
  import { queryData, IqueryData } from "./table";

  // const state = reactive<{
  //   query: IqueryData[];
  //   queryForm: FormInstance;
  // }>({
  //   query: queryData,
  //   queryForm: {} as FormInstance,
  // });

  // // const { query, queryForm } = toRefs(state);

  // onMounted(() => {
  //   getDataList();
  // });

  // function getDataList() {}

  function roleAdd() {}

  function roleDel() {}

  // 查询、表单操作相关
  const queryModule = reactive<{
    queryForm: FormInstance;
    query: IqueryData[];
  }>({
    queryForm: {} as FormInstance,
    query: queryData,
  });

  // function Search() {
  //   // console.log(state.queryForm); // 搜索的字段
  //   getDataList();
  // }
  // function Recover() {
  //   // state.queryForm = {} as FormInstance;
  //   getDataList();
  // }
</script>

<style scoped lang="scss"></style>
